<html>
  <body>
    <div id="mocha"></div>
    <!-- use mocha from CDN instead of local node_modules -->
    <!-- because somehow parcel is failing do build mocha correctly -->
    <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
    <script src="https://unpkg.com/mocha/mocha.js"></script>
    <script>
      mocha.setup('bdd');
    </script>

    <script>
      beforeEach(function () {
        var title = document.createElement('p'),
          test = this.currentTest;

        title.innerHTML = test.parent.title + ' - ' + test.title;
        title.className = 'konva-title';
        document.getElementById('konva-container').appendChild(title);
      });
    </script>
    <script type="module">
      import './manual/Manual-test.ts';

      import './manual/Blur-test.ts';
      import './manual/Filter-test.ts';
      import './manual/Brighten-test.ts';
      import './manual/RGB-test.ts';
      import './manual/RGBA-test.ts';
      import './manual/HSV-test.ts';
      import './manual/HSL-test.ts';
      import './manual/Invert-test.ts';
      import './manual/Mask-test.ts';
      import './manual/Grayscale-test.ts';
      import './manual/Enhance-test.ts';
      import './manual/Pixelate-test.ts';
      import './manual/Noise-test.ts';
      import './manual/Threshold-test.ts';
      import './manual/Posterize-test.ts';
      import './manual/Sepia-test.ts';
      import './manual/Contrast-test.ts';
      import './manual/Emboss-test.ts';
      import './manual/Solarize-test.ts';
      import './manual/Kaleidoscope-test.ts';
    </script>

    <script>
      mocha.run();
    </script>
    <div id="konva-container"></div>
    <img
      src="url:./assets/lion.png"
      alt="test image"
      id="lion.png"
      style="display: none"
    />
    <img
      src="url:./assets/darth-vader.jpg"
      alt="test image"
      id="darth-vader.jpg"
      style="display: none"
    />
    <img
      src="url:./assets/scorpion-sprite.png"
      alt="test image"
      id="scorpion-sprite.png"
      style="display: none"
    />
  </body>
</html>
